<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<link rel="stylesheet" href="demo.css" type="text/css" />
	<script type="text/javascript" src="mootools-core-1.3.1-full-nocompat.js"></script>
    <script type="text/javascript" src="mootools-1.3.1.1-more.js"></script>
	<script type="text/javascript" src="../Source/scrollGallery.js"></script>
    <script type="text/javascript">
        window.addEvent('domready', function() {
            var scrollGalleryObj = new scrollGallery({
				start:0,
				autoScroll: true
			});
        });
    </script>

	<title>Scroll Gallery with auto scroll</title>
</head>
<body>

    <div id="gallery">

                <div id="scrollGalleryHead">
					<div id="thumbarea">
						<div id="thumbareaContent">
                            <img  src="fotos/small_image1.jpg" width="120" height="80" alt="" />
                            <img  src="fotos/small_image2.jpg" width="120" height="80" alt="" />
                            <img  src="fotos/small_image3.jpg" width="120" height="80" alt="" />
                            <img  src="fotos/small_image4.jpg" width="120" height="80" alt="" />
                            <img  src="fotos/small_image5.jpg" width="120" height="80" alt="" />
                            <img  src="fotos/small_image6.jpg" width="120" height="80" alt="" />
                            <img  src="fotos/small_image7.jpg" width="120" height="80" alt="" />
                            <img  src="fotos/small_image8.jpg" width="120" height="80" alt="" />
                            <img  src="fotos/small_image9.jpg" width="120" height="80" alt="" />
                            <img  src="fotos/small_image10.jpg" width="120" height="80" alt="" />
                            <img  src="fotos/small_image11.jpg" width="120" height="80" alt="" />
                            <img  src="fotos/small_image12.jpg" width="120" height="80" alt="" />
                            <img  src="fotos/small_image13.jpg" width="120" height="80" alt="" />
                            <img  src="fotos/small_image14.jpg" width="120" height="80" alt="" />
						</div> 
					</div>
				</div>
				<div id="scrollGalleryFoot">
					<div id="imagearea">
					  <div id="imageareaContent">
                            <img  src="fotos/image1.jpg" alt="" />
                            <img  src="fotos/image2.jpg" alt="" />
                            <img  src="fotos/image3.jpg" alt="" />
                            <img  src="fotos/image4.jpg" alt="" />
                            <img  src="fotos/image5.jpg" alt="" />
                            <img  src="fotos/image6.jpg" alt="" />
                            <img  src="fotos/image7.jpg" alt="" />
                            <img  src="fotos/image8.jpg" alt="" />
                            <img  src="fotos/image9.jpg" alt="" />
                            <img  src="fotos/image10.jpg" alt=""  />
                            <img  src="fotos/image11.jpg" alt="" />
                            <img  src="fotos/image12.jpg" alt="" />
                            <img  src="fotos/image13.jpg" alt="" />
                            <img  src="fotos/image14.jpg" alt="" />
                            
                      </div> 
					</div> 
				</div>

    </div>
</body>
</html>
